{% extends "base/base-sidebar.html" %}

{% block title %}Overworld Seed Checker{% endblock %}

{% block head %}
{% endblock %}

{% block main %}
	<div class="tab">
		<button class="reslinks" id="defaultresOpen" data-pla-tab-for="Results">Results</button>
		<button class="reslinks" data-pla-tab-for="Seedfinder">SWSH Seed Finder</button>
	</div>
	
	<div id="Results" class="tabcontentres">
	<section class="swsh-section-results">
		<div data-pla-messages></div>
		<div class="swsh-results" data-swsh-results>
			<p class="swsh-results-message">This tool was created by Cappy, with help from Anubis, Kurt, Lincoln, Zyro and Santacrab420 for code and other assistance.</p>
		</div>
	</section>
	</div>
	
	<div id="Seedfinder" class="tabcontentres">
	<section class="pla-section-results">
		<div data-pla-messages></div>
		<div class="pla-results" data-pla-results>
			<div class="info">
        <a>Record 128 Motions (Press Right Stick on Summary)</a><br>
		
        <a>You will be 128 advances from this state after recording motions</a><p>
		
		<a>Motions:</a><input style="width: 95%;" type="text" id="motions" maxlength=128 value=""><br>
		
        <button class="swsh-button swsh-button-action" id="addmotion0">(0) Physical</button>
		<button class="swsh-button swsh-button-action" id="addmotion1">(1) Special</button><br>
		
        <a id="count">000</a><a>/128</a><br>
        <button class="swsh-button swsh-button-action" id="findseed">Find Seed!</button><br>
        <!--<span class="data-swsh-results">[S0]: </span><span data-s0></span><br>
        <span class="data-swsh-results">[S1]: </span><span data-s1></span>-->
		<div class="swsh-control">
			<label for="data-s0">State[0]:</label>
			<input id="data-s0">
		</div>
		
		<div class="swsh-control">
			<label for="data-s1">State[1]:</label>
			<input id="data-s1">
		</div>
		<button class="swsh-button swsh-button-action" id="updatewithstate">Update Sidebar With States</button>
		</div>
		</div>
	</section>
	
		<section class="pla-section-expandable">
			<button type="button" class="pla-button expandable-control">Seed Updater</button>
		
			<div class="expandable">
				<a>Record Motions and input starting advance and max advances to get updated State and Advances:</a>
				<div class="swsh-control">
					<input id="seedupdate">
				</div>
				
				<div class="swsh-control">
					<label for="startingadvance">Initial Advance:</label>
					<input id="startingadvance">
				</div>
				
				<div class="swsh-control">
					<label for="maxadvance">Max Advance:</label>
					<input id="maxadvance">
				</div>
			
			
				<button class="swsh-button swsh-button-action" id="updateseed">Find Updated State</button>
				
				<div class="swsh-results-item">
					<ul class="pla-results-ul">
						<li><span class="pla-results-label">Number of Results: </span> <span data-seed-count></span></li>
						<li><span class="pla-results-label">Advances: </span> <span data-seed-adv></span></li>
					</ul>
					
					<ul class="pla-results-ul">
						<li><span class="pla-results-label">State[0]: </span> <span data-updated-s0></span></li>
						<li><span class="pla-results-label">State[0]: </span> <span data-updated-s1></span></li>
					</ul>
				</div>
				
				<button class="swsh-button swsh-button-action" id="updatesidebarstate">Update Sidebar With States</button>
			</div>
		</section>
		
		Credit for algorithm! <br>
		<a href="https://github.com/niart120/Project_Xe">Project Xe</a>
	</section>
	</div>
		
{% endblock %}

{% block sidebar %}
	<section class="swsh-section-options">
	
		<div class="tab">
			<button class="tablinks" id="defaultOpen" data-swsh-tab-for="RNG">RNG Info</button>
			<button class="tablinks" data-swsh-tab-for="Options">Options</button>
			<button class="tablinks" data-swsh-tab-for="Filter">Filter</button>
		</div>
		
		<div id="RNG" class="tabcontent">

		<div class="swsh-control">
			<label for="inputseed0">State[0]:</label>
			<input id="inputseed0" placeholder="Input State[0]">
		</div>
		
		<div class="swsh-control">
			<label for="inputseed1">State[1]:</label>
			<input id="inputseed1" placeholder="Input State[1]">
		</div>

		<div class="swsh-control">
			<label for="initadv">Initial Advance:</label>
			<input id="initadv" type="number" placeholder="Input Initial Advance">
		</div>
		
		<div class="swsh-control">
			<label for="finaladv">Max Advance:</label>
			<input id="finaladv" type="number" placeholder="Input Max Advance">
		</div>
		
		<div class="swsh-control">
			<label for="tid">TID:</label>
			<input id="tid" type="number" placeholder="Input TID">
		</div>
		
		<div class="swsh-control">
			<label for="sid">SID:</label>
			<input id="sid" type="number" placeholder="Input SID">
		</div>
		
		<div class="swsh-control">
			<label for="shiny_charm">Shiny Charm?</label>
			<input type="checkbox" id="shiny_charm">
		</div>
		
		<div class="swsh-control">
			<label for="mark_charm">Mark Charm?</label>
			<input type="checkbox" id="mark_charm">
		</div>
		
		<div class="swsh-control">
			<label for="cute_charm">Cute Charm:</label>
			<select id="cute_charm">
				<option value="None">None</option>
				<option value="0">Cute Charm Female</option>
				<option value="1">Cute Charm Male</option>
			</select>
		</div>


		</div>
		
		<div id="Options" class="tabcontent">
		
			<div class="swsh-control">
				<label for="version">Game Version:</label>
				<select id="version">
					<option value="Sword">Sword</option>
					<option value="Shield">Shield</option>
				</select>
			</div> 
			
			<div class="swsh-control">
				<label for="type">Type of Encounter:</label>
				<select id="type">
					<option value="Static">Static</option>
					<option value="Symbol">Spawn</option>
					<option value="Hidden">Hidden</option>
				</select>
			</div> 
			
			<div class="swsh-control">
				<label for="location">Select Location:</label>
				<select id="location">
					<option value="">Location:</option>
				</select>
			</div>
			
			<div class="swsh-control">
				<label for="weather">Select Weather:</label>
				<select id="weather">
					<option value="">Weather:</option>
				</select>
			</div>
			
			<div class="swsh-control">
				<label for="species">Select Species:</label>
				<select id="species">
					<option value="">Species:</option>
				</select>
			</div>
			
			<div class="swsh-control">
				<label for="kos">KOs:</label>
				<input id="kos">
			</div>
			
			<!--<div class="swsh-control">
				<label for="setgender">Set Gender?</label>
				<input id="setgender" type="checkbox">
			</div>-->
			
			<div class="swsh-control">
				<label for="weatheractive">Weather Active?</label>
				<input id="weatheractive" type="checkbox">
			</div>
			
			<div class="swsh-control">
				<label for="minslot">Min Slot:</label>
				<input id="minslot">
				<label for="maxslot">Max Slot:</label>
				<input id="maxslot">
			</div>
			
			<div class="swsh-control">
				<label for="minlevel">Min Level:</label>
				<input id="minlevel">
				<label for="maxlevel">Max Level:</label>
				<input id="maxlevel">
			</div>
			
			<div class="swsh-control">
				<label for="emcount">Egg Move Count:</label>
				<input id="emcount" type="number">
			</div>
			
			<div class="swsh-control">
				<label for="helditem">Rand Held Item?</label>
				<input id="helditem" type="checkbox">
			</div>
			
			<div class="swsh-control">
				<label for="flawlessivs">Flawless IVs:</label>
				<input id="flawlessivs">
			</div>
			
			<div class="swsh-control">
				<label for="shinylock">Shiny Locked?</label>
				<input id="shinylock" type="checkbox">
			</div>
		</div>
		
		<div id="Filter" class="tabcontent">
		
		<label>Min IVs:</label>
			<div class="pla-control-spaced">
				<input type="number" id="minhp" placeholder="HP" size="2" min="0" max="31" class="ivbox"> <input type="number" id="minatk" placeholder="ATK" size="2" min="0" max="31" class="ivbox"> <input type="number" id="mindef" placeholder="DEF" size="2" min="0" max="31" class="ivbox"><input type="number" id="minspa" placeholder="SpA" size="2" min="0" max="31" class="ivbox"> <input type="number" id="minspd" placeholder="SpD" size="2" min="0" max="31" class="ivbox"> <input type="number" id="minspe" placeholder="Spe" size="2" min="0" max="31" class="ivbox">
			</div>

			<label>Max IVs:</label>
			<div class="pla-control-spaced">
				<input type="number" id="maxhp" placeholder="HP" size="2" min="0" max="31" class="ivbox"> <input type="number" id="maxatk" placeholder="ATK" size="2" min="0" max="31" class="ivbox"> <input type="number" id="maxdef" placeholder="DEF" size="2" min="0" max="31" class="ivbox"><input type="number" id="maxspa" placeholder="SpA" size="2" min="0" max="31" class="ivbox"> <input type="number" id="maxspd" placeholder="SpD" size="2" min="0" max="31" class="ivbox"> <input type="number" id="maxspe" placeholder="Spe" size="2" min="0" max="31" class="ivbox">
			</div>
			
			<div class="pla-options">
				<label for="brillfilter">Brilliant Filter?</label>
				<input id="brillfilter" type="checkbox">
			</div>
			
			<div class="pla-options">
				<label for="shinyfilter">Shiny Filter:</label>
				<select id="shinyfilter">
					<option value="None">None</option>
					<option value="Star">Star</option>
					<option value="Square">Square</option>
					<option value="Star/Square">Star/Square</option>
				</select>
			</div>
			
		</div>
			
			<div class="swsh-control-actions">
				<button class="swsh-button swsh-button-action" id="swsh-button-checkow">Check Overworld Seed</button>
			</div>
		</div>
	</section>
	
	<section>
        
        <div class="pla-control">
			<label for="naturefilter">Filter Results: Nature:</label>
			<select id="naturefilter" class="chosen-select" multiple>
				<option value="any">Any</option>
				<option value="hardy">Hardy</option>
				<option value="lonely">Lonely</option>
				<option value="brave">Brave</option>
				<option value="adamant">Adamant</option>
				<option value="naughty">Naughty</option>
				<option value="bold">Bold</option>
				<option value="docile">Docile</option>
				<option value="relaxed">Relaxed</option>
				<option value="impish">Impish</option>
				<option value="lax">Lax</option>
				<option value="timid">Timid</option>
				<option value="hasty">Hasty</option>
				<option value="serious">Serious</option>
				<option value="jolly">Jolly</option>
				<option value="naive">Naive</option>
				<option value="modest">Modest</option>
				<option value="mild">Mild</option>
				<option value="quiet">Quiet</option>
				<option value="bashful">Bashful</option>
				<option value="rash">Rash</option>
				<option value="calm">Calm</option>
				<option value="gentle">Gentle</option>
				<option value="sassy">Sassy</option>
				<option value="careful">Careful</option>
				<option value="quirky">Quirky</option>
			</select>
		</div>
		<div class="pla-control">
			<label for="markfilter">Filter Results: Mark:</label>
			<select id="markfilter" class="chosen-select" multiple>
				<option value="any">No Filter</option>
				<option value="AnyMark">Any Mark</option>
				<optgroup label="Personality Marks">
				<option value="AnyPersonality">Any Personality</option>
				<option value="Rowdy">Rowdy</option>
				<option value="AbsentMinded">Absent Minded</option>
				<option value="Jittery">Jittery</option>
				<option value="Excited">Excited</option>
				<option value="Charismatic">Charismatic</option>
				<option value="Calmness">Calmness</option>
				<option value="Intense">Intense</option>
				<option value="ZonedOut">Zoned Out</option>
				<option value="Joyful">Joyful</option>
				<option value="Angry">Angry</option>
				<option value="Smiley">Smiley</option>
				<option value="Teary">Teary</option>
				<option value="Upbeat">Upbeat</option>
				<option value="Peeved">Peeved</option>
				<option value="Intellectual">Intellectual</option>
				<option value="Ferocious">Ferocious</option>
				<option value="Crafty">Crafty</option>
				<option value="Scowling">Scowling</option>
				<option value="Kindly">Kindly</option>
				<option value="Flustered">Flustered</option>
				<option value="PumpedUp">Pumped Up</option>
				<option value="ZeroEnergy">Zero Energy</option>
				<option value="Prideful">Prideful</option>
				<option value="Unsure">Unsure</option>
				<option value="Humble">Humble</option>
				<option value="Thorny">Thorny</option>
				<option value="Vigor">Vigor</option>
				<option value="Slump">Slump</option>
				</optgroup>
				<option value="Time">Time</option>
				<option value="Weather">Weather</option>
				<option value="Uncommon">Uncommon</option>
				<option value="Rare">Rare</option>
			</select>
		</div>
		
		<label for="genderfilter">Filter Results: Gender:</label>
		<select id="genderfilter">
			<option value=50>Any</option>
			<option value=0>Male</option>
			<option value=1>Female</option>
		</select>
		
		
    </section>

{% endblock %}

{% block templates %}
	
	<template data-pla-results-template>
        <div class="pla-results-item" data-pla-results-template>
            <ul class="pla-results-heading pla-results-ul">
                <li class="pla-results-sprite" data-pla-results-sprite></li>
                <li class="pla-results-species" data-pla-results-species></li>
				<li></li>
            </ul>

            <ul class="pla-results-ul">
                <li><span class="pla-results-label">Shiny:</span> <span class="float -left" data-pla-results-shinysprite><span class="float -right" data-pla-results-shiny></span></span></li>
				<li><span class="pla-results-label">Brilliant:</span> <span data-pla-results-brill></span></li>
				<li><span class="pla-results-label">Mark:</span> <span data-pla-results-mark></span></li>
			</ul>
            
			<ul class="pla-results-ul">
				<li><span class="pla-results-label">Advances:</span> <span data-pla-results-adv></span></li>
			</ul>

            <ul class="pla-results-ul">
                <li><span class="pla-results-label">Nature:</span> <span data-pla-results-nature></span></li>
                <li><span class="pla-results-label">Gender:</span> <span data-pla-results-gender></span></li>
            </ul>
			
			<ul class="pla-results-ul">
                <li><span class="pla-results-label">Ability:</span> <span data-pla-results-ability></span></li>
				<li><span class="pla-results-label">Egg Move:</span> <span data-pla-results-egg></span></li>
			</ul>

            <ul class="pla-results-ul">
                <li><span class="pla-results-label">PID:</span> <span data-pla-results-pid></span></li>
				<li><span class="pla-results-label">EC:</span> <span data-pla-results-ec></span></li>
            </ul>

            <div class="pla-results-ivs-container">
                <span class="pla-results-label">IVs:</span>
                <ul class="pla-results-ivs">
                    <li class="pla-results-ivs-hp" data-pla-results-ivs-hp></li>
                    <li class="pla-results-ivs-att" data-pla-results-ivs-att></li>
                    <li class="pla-results-ivs-def" data-pla-results-ivs-def></li>
                    <li class="pla-results-ivs-spa" data-pla-results-ivs-spa></li>
                    <li class="pla-results-ivs-spd" data-pla-results-ivs-spd></li>
                    <li class="pla-results-ivs-spe" data-pla-results-ivs-spe></li>
                </ul>
            </div>
         </div>
		 </template>

{% endblock %}

{% block script %}
	<script type="module" src="{{ url_for('static', filename='js/overworld.js') }}"></script>
{% endblock %}
